// 封装分类数据业务相关代码
import { useRoute } from 'vue-router'
import { onMounted, ref } from 'vue'
import { getCategory } from '@/apis/category'
import { onBeforeRouteUpdate } from 'vue-router';
export function useCategory() {
    // 获取路由参数
    const route = useRoute()
    const routeId = route.params.id

    const categoryData = ref({})
    const getCategoryList = async (id = routeId) => {
        const res = await getCategory(id)
        console.log(res)
        categoryData.value = res.result
    }

    onMounted(() => {
        // 第一次调用的时候不用传递参数，让他使用默认的
        getCategoryList()
    })

    // 目标：路由参数发生变化时 可以把分类数据接口重新发送
    onBeforeRouteUpdate((to) => {
        console.log('路由发生变化了');
        // 存在问题：使用最新的路由参数请求最新的分类数据（从名字before可以看出是跳转之前所执行的，route.params.id有一定的滞后性，所以不能直接用route.params.id）
        console.log(to);
        getCategoryList(to.params.id)
    })
    return {
        categoryData
    }
}
